<script>
  function UniqueCtrl($scope) {
    $scope.items = [
      { firstName: 'Dean', lastName: 'Sofer',
        id: 1, gender: 'Male' },
      { firstName: 'Dean', lastName: 'Kuntz',
        id: 2, gender: 'Male' },
      { firstName: 'Peter', lastName: 'Piper',
        id: 3, gender: 'Female' },
      { firstName: 'Peter', lastName: 'Darwin',
        id: 4, gender: 'Male' },
      { firstName: 'Janet', lastName: 'Piper',
        id: 5, gender: 'Female' },
      { firstName: 'Dan', lastName: 'Doyon',
        id: 6, gender: 'Male' },
      { firstName: 'Andy', lastName: 'Joslin',
        id: 1, gender: 'Male' },
    ];
  }
</script>
<section id="unique" ng-controller="UniqueCtrl">
  <div class="page-header">
    <h1>Unique</h1>
  </div>
  <div class="row">
    <div class="span6">
      <h3>What?</h3>

      <p>Filters out all duplicate objects items from an array by checking the specified key</p>

      <div class="well">
        <p>Select an attribute to check for uniqueness</p>
        <select ng-model="attribute">
          <option value="">-- No Filter --</option>
          <option>firstName</option>
          <option>lastName</option>
          <option>id</option>
          <option>gender</option>
        </select>
        <pre>{{items | unique:attribute | json}}</pre>
      </div>
    </div>
    <div class="span6">
      <h3>How?</h3>

      <p>The filter can take the name of the key to check for uniqueness or set to a non-string truthy value to check the entire object.</p>
<pre class="prettyprint">
&lt;select ng-model=&quot;attribute&quot;&gt;
&lt;option value=&quot;&quot;&gt;-- No Filter --&lt;/option&gt;
&lt;option&gt;firstName&lt;/option&gt;
&lt;option&gt;lastName&lt;/option&gt;
&lt;option&gt;id&lt;/option&gt;
&lt;option&gt;gender&lt;/option&gt;
&lt;/select&gt;
&lt;pre&gt;{{items | unique:attribute | json}}&lt;/pre&gt;

&lt;script&gt;
$scope.items = [
{ firstName: &#x27;Dean&#x27;, lastName: &#x27;Sofer&#x27;,
id: 1, gender: &#x27;Male&#x27; },
{ firstName: &#x27;Dean&#x27;, lastName: &#x27;Kuntz&#x27;,
id: 2, gender: &#x27;Male&#x27; },
{ firstName: &#x27;Peter&#x27;, lastName: &#x27;Piper&#x27;,
id: 3, gender: &#x27;Female&#x27; },
{ firstName: &#x27;Peter&#x27;, lastName: &#x27;Darwin&#x27;,
id: 4, gender: &#x27;Male&#x27; },
{ firstName: &#x27;Janet&#x27;, lastName: &#x27;Piper&#x27;,
id: 5, gender: &#x27;Female&#x27; },
{ firstName: &#x27;Dan&#x27;, lastName: &#x27;Doyon&#x27;,
id: 6, gender: &#x27;Male&#x27; },
{ firstName: &#x27;Andy&#x27;, lastName: &#x27;Joslin&#x27;,
id: 1, gender: &#x27;Male&#x27; },
];
&lt;/script&gt;
</pre>
    </div>
  </div>
</section>